<template>
	<view>
		<view style="text-align: center;">
			<image v-if="this.doctorId" :src="Data.avatar" style="border-radius: 50%;width: 90px;height: 90px;">
			</image>
			<image v-else :src="Data.photo" style="border-radius: 50%;width: 90px;height: 90px;"></image>
			<view style="font-weight: bold;font-size: 22px;">{{Data.name}}</view>
			<view style="margin-left: 100px; margin-top: 10px;">
				<uni-rate :value="doctorRating" :size="40" @change="onRatingChange" />
			</view>
			<view style="display: flex;justify-content: center;margin-top: 5px;">
				<view>————</view>
				<!-- 使用v-if来根据评分显示不同的评价 -->
				<view v-if="doctorRating ==0">请给进行评价</view>
				<view v-if="doctorRating ==1">非常不满意</view>
				<view v-if="doctorRating ==2">不满意</view>
				<view v-if="doctorRating ==3">一般</view>
				<view v-if="doctorRating ==4">满意</view>
				<view v-if="doctorRating ==5">非常满意</view>
				<view>————</view>
			</view>
		</view>
		<view class="box" style="margin-top: 10px;">
			<uni-forms :modelValue="form" :rules="rules" ref="formRef" label-width="150rpx" label-align="right">
				<uni-forms-item label="评价标题" name="title" required>
					<uni-easyinput type="text" v-model="form.title" placeholder="请输入评价标题" />
				</uni-forms-item>
				<uni-forms-item label="评价内容" name="content" required>
					<uni-easyinput type="textarea" v-model="form.content" placeholder="请输入评价内容" />
				</uni-forms-item>
				<uni-forms-item v-if="this.doctorId" label="评价类型" name="type" required>
					<uni-data-select v-model="form.type" :localdata="evaluationTypes" />
				</uni-forms-item>
			</uni-forms>
			<view>
				<view style="margin-left: 4px;">
					<view style="font-size: 20px;font-weight: bold;margin-top: 4px;">发布条款
						<checkbox :checked="agreedToTerms" @click="handleAgreedToTermsChange()"
							style="margin-left: 5px;" />
					</view>
					<p>本人同意《智慧医疗评论发布条款》，评论内容可由平台脱敏后展示，承诺为该平台真实患者，内容客观，并对言论负责。
						允许平台选择您的评价作为就医分享同步到患者社区进行展示，并加入对应社区</p>
				</view>
			</view>
			<view style="margin-top: 10px;">
				<button type="primary" @click="submitForm" class="my-button-primary">发布评价</button>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				doctorRating: 0, // 初始评分值
				Data: {},
				user: uni.getStorageSync('xm-user'),
				form: {

				},
				rules: {
					title: {
						rules: [{
							required: true,
							errorMessage: '请输入评价标题'
						}]
					},
					content: {
						rules: [{
							required: true,
							errorMessage: '请输入评价内容'
						}]
					},
					type: {
						rules: [{
							required: true,
							errorMessage: '请选择评价类型'
						}]
					}
				},
				evaluationTypes: [{
						value: '就诊',
						text: '就诊'
					},
					{
						value: '咨询',
						text: '咨询'
					}
				],
				agreedToTerms: false,
				medicinesId: null,
				doctorId: null,
			};
		},
		onLoad(option) {
			this.doctorId = option.doctorId;
			this.medicinesId = option.medicinesId;
		},
		onShow() {
			this.loadData()
		},
		methods: {
			loadData() {
				if (this.medicinesId) { // 存在性检查
					this.loadMedicines();
				} else if (this.doctorId) {
					this.loadDoctor();
				}
			},
			loadMedicines() {
				this.$request.get(`/medicines/selectById/${this.medicinesId}`).then(res => {
					if (res.code === '200') {
						this.Data = res.data;
					} else {
						this.$message.error(res.msg);
					}
				});
			},
			loadDoctor() {
				this.$request.get(`/doctor/selectByDoctorId/${this.doctorId}`).then(res => {
					if (res.code === '200') {
						this.Data = res.data;
					}
				}).catch(error => {
					// 处理可能发生的错误
					this.$message.error('加载医生信息失败');
					console.error(error);
				});
			},
			onRatingChange(e) {
				// 更新评分值
				this.doctorRating = e.value;
			},
			handleAgreedToTermsChange() {
				this.agreedToTerms = !this.agreedToTerms; // 更新选中状态
				console.log(this.agreedToTerms)
			},
			submitForm() {
				if (!this.agreedToTerms) {
					uni.showToast({
						title: '请同意发布条款',
						icon: 'none'
					});
					return;
				}
				if (this.doctorRating <= 0) {
					uni.showToast({
						title: '请给进行评价',
						icon: 'none'
					});
					return;
				}
				let data;
				if(this.doctorId){
					 data = {
						fid: this.doctorId,
						userId: this.user.id,
						star: this.doctorRating,
						content: this.form.content,
						title: this.form.title,
						type: this.form.type,
						module: 'DOCTOR'
					}
				}else{
					 data = {
						fid: this.medicinesId,
						userId: this.user.id,
						star: this.doctorRating,
						content: this.form.content,
						title: this.form.title,
						module: 'MEDICINES'
					}
				}
				this.$refs.formRef.validate().then(valid => {
					if (valid) {
						this.$request.post('/userComment/add', data).then(res => {
							if (res.code === '200') {
								uni.showToast({
									title: '评价成功',
									icon: 'success'
								});
								setTimeout(() => {
									uni.navigateBack();
								}, 1000); // 延时1.5秒后执行返回操作
							} else {
								this.$message.error(res.msg)
							}
						})
					}
				}).catch((err) => {
					// 表单校验失败，可以在这里处理错误
					console.log('表单校验失败：', err);
				});
			}
		}
	}
</script>

<style>
	/* 样式可以根据需要添加 */
</style>